import {Button} from "antd";
import {useReducer} from "react";

/*
* useReducer 作为useState升级版，页面变量数量多时使用会友好
* */

const reducer = (state,action) => {
    state = {...state}
    switch (action.type) {
        case 'add' : state.count ++
            break;
        case 'minus' : state.count --
            break;
    }
    return state
}

const init = {
    count : 0
}

const Dom = () => {

    let [ state , dispatch ] = useReducer( reducer , init )
    let  { count } = state

   const add = () => {
        dispatch({type : "add"})
   }
   const minus = () => {
        dispatch({type : "minus"})
   }

    return <>
        <div>{count}</div>
        <Button type="primary" onClick={ add }>++</Button>
        <Button type="primary" onClick={ minus }>--</Button>

    </>
}

export default Dom
